<template>
  <home-com
    :enums="enums"
    :project-name="currentProject ? currentProject.name : '后端管理系统'"
    :emit-model="true"
    :default-enum-active="enumActive"
    :enum-index-key="enumIndexKey"
    enum-key-key="_id"
    @enum-select="enumSelect"
  >
    <template slot="header-left">
      <el-button type="text" @click="userSystem">用户系统</el-button>
      <el-button type="text" @click="toolBtnClick">工具</el-button>
    </template>
    <template slot="header-center">
      <el-button v-if="currentUuid" type="text" @click="uuidClick">{{ currentUuid }}</el-button>
    </template>
    <template slot="header-right">
      <el-button class="project-switch-btn" type="text" @click="projectSwitchClick">项目切换</el-button>
    </template>
  </home-com>
</template>

<script lang="ts">
  import { Vue, Component } from 'vue-property-decorator'
  import { Getter } from 'vuex-class'
  import HomeCom from '@/components/layout/home/index.vue'
  import EnumModel from '@/models/EnumModel'
  import ArticleModel from "@/models/ArticleModel";
  import YBPopView from "@/utils/popView";

  @Component({
    components: {
      HomeCom
    }
  })

  export default class Home extends Vue{

    @Getter('enums') enums!: Array<EnumModel>
    @Getter('currentProject') currentProject?: ArticleModel

    enumIndexKey = '_id'
    enumActive = ''
    // 当前界面对应的UUID
    currentUuid = ''

    projectSwitchClick() {
      this.$store.commit('SET_PROJECT')
      this.$router.replace('/project')
    }

    uuidClick() {
      this.$copyText(this.currentUuid).then(function (){
        YBPopView.msgSuccess('复制成功')
      })
    }

    toolBtnClick() {
      window.open('https://wangyabin.top/web/tool')
    }

    /**
     * 根据键值获取当前模型
     */
    getModelWithKeys(keys: Array<string>, dataArr: Array<EnumModel>): EnumModel | undefined {
      const [one, ...other] = keys
      if (keys.length > 1) {
        const children = dataArr.find(item => (item as any)[this.enumIndexKey] === one)!.children
        return this.getModelWithKeys(other, children || [])
      } else {
        return dataArr.find(item => (item as any)[this.enumIndexKey] === one)
      }
    }

    getModelWithKey(key: string, dataArr: Array<EnumModel>): EnumModel | undefined {
      for (let i = 0; i < dataArr.length; i++) {
        const model = dataArr[i]
        if ((model as any)[this.enumIndexKey] === key) {
          return model
        }
        if (model.children && model.children.length) {
          const childModel = this.getModelWithKey(key, model.children)
          if (childModel) {
            return childModel
          }
        }
      }
    }

    userSystem() {
      location.href = `${process.env.VUE_APP_JUMP_ROOT_URL}/admin.html`
    }

    enumSelect(id: string, ids: Array<string>) {
      const model = this.getModelWithKeys(ids, this.enums)
      this.currentUuid = model?.uuid || ''
      if (id === this.$route.params.id) {
        return
      }
      this.$router.push(model?.enumPath || '/')
    }

    mounted() {
      const { id } = this.$route.params
      this.enumActive = id
      this.currentUuid = this.getModelWithKey(id, this.enums)?.uuid || ""
    }
  }
</script>

<style lang="scss" scoped>
  .project-switch-btn {
    margin-left: 20px;
  }
</style>
